import usePopup from '../PopUp/hooks/usePopup';
const RightMenu = (props) => {
  const {
    children,
    className,
    targetClassName,
    content,
    datasetKey,
    containerId,
  } = props;
  const { open } = usePopup();
  const handleContextMenu = (e) => {
    e.preventDefault();
    const target = e.target.closest(`.${targetClassName}`);
    const dataset = target?.dataset[datasetKey];
    if (target) {
      open({ content, x: e.clientX, y: e.clientY, dataset, containerId });
    }
  };

  return (
    <div className={`${className}`} onContextMenu={handleContextMenu}>
      {children}
    </div>
  );
};

export default RightMenu;
